<form nz-form class="authority-list-search-form">
    <div nz-row>
        <div nz-col nzXl="7" nzXXl="12">
            <nz-form-item class="ant-form-item">
                <nz-form-control>
                    <button nz-button nzType="primary" (click)="showFormDialog()" nzSize="small">
                        <span nz-icon nzType="plus" nzTheme="outline"></span>
                        创建权限资源
                    </button>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col nzXl="7" nzXXl="5">
            <nz-form-item class="ant-form-item">
                <nz-form-label [nzFor]="'authorityName'">权限名称</nz-form-label>
                <nz-form-control>
                    <input nz-input [attr.id]="'authorityName'" [(ngModel)]="authorityName"
                           [ngModelOptions]="{standalone: true}" nzSize="small"/>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col nzXl="6" nzXXl="4">
            <nz-form-item class="ant-form-item">
                <nz-form-label [nzFor]="'dictTypeName'">权限类型</nz-form-label>
                <nz-form-control>
                    <nz-radio-group [(ngModel)]="authorityType" [ngModelOptions]="{standalone: true}"
                                    nzSize="small" nzButtonStyle="solid" (ngModelChange)="search()"
                    >
                        @for (item of authorityTypeOption; track item) {
                            <label nz-radio-button [nzValue]="item.value">
                                {{ item.label }}
                            </label>
                        }
                    </nz-radio-group>
                </nz-form-control>
            </nz-form-item>
        </div>
        <div nz-col nzXl="4" nzXXl="3">
            <nz-form-item class="ant-form-item">
                <nz-form-control>
                    <button nz-button [nzType]="'primary'" nzSize="small" (click)="search()">
                        <span nz-icon nzType="search" nzTheme="outline"></span>查询
                    </button>
                    <button nz-button nzSize="small" (click)="reset()">
                        <span nz-icon nzType="reload" nzTheme="outline"></span>重置
                    </button>
                </nz-form-control>
            </nz-form-item>
        </div>

    </div>
</form>

<div class="search-result-list">
    <nz-table #expandTable [nzData]="treeNodeListOfAuthority" nzOuterBordered nzTableLayout="fixed"
              (nzQueryParams)="onQueryParamsChange($event)"

              nzShowSizeChanger
              [nzFrontPagination]="false"
              [nzLoading]="_loading"
              nzSize="small"
    >
        <thead>
        <tr>
            @for (col of cols; track col.field) {
                @if (col.sortable == true) {
                    <th [id]="col.field" [nzColumnKey]="col.field" [nzSortFn]="col.sortable == true"
                        style="font-weight: bold;" [style.width]="col.width">{{ col.header }}
                    </th>
                } @else {
                    <th [id]="col.field" style="font-weight: bold" [style.width]="col.width">
                        {{ col.header }}
                    </th>
                }
            }
        </tr>
        </thead>
        <tbody>
            @for (data of expandTable.data; track data.id) {
                @for (item of mapOfExpandedData.get(data.id); track item.id) {
                    @if ((item.parent && item.parent.expand) || !item.parent) {
                        <tr>
                            <td
                                [nzIndentSize]="item.level! * 20"
                                [nzShowExpand]="!!item.children"
                                [(nzExpand)]="item.expand"
                                (nzExpandChange)="collapse(mapOfExpandedData.get(data.id) || [], item, $event)"
                            >
                                <span nz-icon [nzType]="item.icon" nzTheme="outline" style="margin-right: 5px;"></span>
                                {{ item.authorityName }}
                            </td>
                            <td>{{ item.authorityCode }}</td>
                            <td>{{ item.path }}</td>
                            <td>{{ item.authorityType }}</td>
                            <td>{{ item.level }}</td>
                            <td>
                                {{ item.leaf ? '是' : '否' }}
                            </td>
                            <td>{{ item.sort }}</td>
                            <td>{{ item.createdBy }}</td>
                            <td>{{ item.createdTime }}</td>
                            <td>{{ item.lastUpdatedBy }}</td>
                            <td>{{ item.lastUpdatedTime }}</td>
                            <td>
                                <button nz-button [nzType]="'primary'" nzSize="small" nzShape="circle"
                                        nz-tooltip nzTooltipTitle="编辑" nzTooltipPlacement="left"
                                        (click)="showFormDialog(item.id)"
                                >
                                    <span nz-icon nzType="edit" nzTheme="outline"></span>
                                </button>

                                <button nz-button [nzType]="'primary'" nzSize="small" nzShape="circle" nzDanger
                                        nz-tooltip [nzTooltipTitle]="item.leaf ? '删除' : '只能删除叶子节点'"
                                        nzTooltipPlacement="left"
                                        [disabled]="!item.leaf"

                                        nz-popconfirm
                                        [nzPopconfirmTitle]="'你确定要删除【' + item.authorityName + '】吗？'"
                                        (click)="idToDelete = item.id"
                                        [nzBeforeConfirm]="beforeConfirm"
                                        nzPopconfirmPlacement="top"
                                        [nzCancelButtonProps]="{nzDisabled: cancelButtonDisabled}"
                                >
                                    <span nz-icon nzType="delete" nzTheme="outline"></span>
                                </button>
                            </td>
                        </tr>
                    }
                }
            }
        </tbody>
    </nz-table>
</div>


<!-- 新增、编辑权限资源 弹窗  -->
@if (formDialogDisplay) {
    <app-authority-edit-form [(formDialogDisplay)]="formDialogDisplay" [authorityId]="authorityId"
                             (triggerAuthorityListRefreshEmitter)="search()"
    >
    </app-authority-edit-form>
}
